<!--
 * @Author: your name
 * @Date: 2020-04-14 14:07:25
 * @LastEditTime: 2020-05-03 17:11:21
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \vue-element-admin\src\views\enterprise\troubleDetail.vue
 -->
<template>
  <div class="app-container">
    <fieldset class="fieldInfo">
      <legend>
        <span>隐患基本信息</span>
      </legend>
      <el-form ref="postForm" :model="postForm" class="form-container">
        <div class="createPost-main-container">
          <el-row>
            <el-col :span="24">
              <div class="postInfo-container">
                <el-row>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="所属公司" class="postInfo-container-item">
                      <el-input placeholder="请输入所属公司" v-model="postForm.companyName" readonly></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="隐患级别" class="postInfo-container-item">
                      <el-input placeholder="请输入隐患级别" v-model="postForm.grade" readonly></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="隐患负责人" class="postInfo-container-item">
                      <el-input placeholder="请输入隐患负责人" v-model="postForm.chargePerson" readonly></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="发现日期" class="postInfo-container-item">
                      <el-input placeholder="请输入发现日期" v-model="postForm.findDate" readonly></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label-width="115px" label="隐患描述" class="postInfo-container-item">
                      <el-input
                        placeholder="请输入隐患描述"
                        v-model="postForm.desc"
                        type="textarea"
                        readonly
                        :rows="4"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label-width="115px" label="隐患照片" class="postInfo-container-item">
                      <ele-gallery :source="postForm.pics"></ele-gallery>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="整改类型" class="postInfo-container-item">
                      <el-input placeholder="请输入整改类型" v-model="postForm.type" readonly></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="整改期限" class="postInfo-container-item">
                      <el-input placeholder="请输入整改期限" v-model="postForm.expirationDate" readonly></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label-width="115px" label="整改要求" class="postInfo-container-item">
                      <el-input
                        placeholder="请输入整改要求"
                        v-model="postForm.require"
                        type="textarea"
                        readonly
                        :rows="4"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-form>
    </fieldset>
    <fieldset class="fieldInfo">
      <legend>
        <span>整改情况</span>
      </legend>
      <el-form ref="postForm" :model="postForm" class="form-container">
        <div class="createPost-main-container">
          <el-row>
            <el-col :span="24">
              <div class="postInfo-container">
                <el-row>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="整改人" class="postInfo-container-item">
                      <el-input placeholder="请输入整改人" v-model="postForm.reformPersonName" readonly></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="整改日期" class="postInfo-container-item">
                      <el-input placeholder="请输入整改日期" v-model="postForm.reformDate" readonly></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label-width="115px" label="整改后照片" class="postInfo-container-item">
                      <ele-gallery :source="postForm.pics"></ele-gallery>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label-width="115px" label="整改内容" class="postInfo-container-item">
                      <el-input
                        placeholder="请输入整改内容"
                        v-model="postForm.reformContent"
                        readonly
                        type="textarea"
                        :rows="4"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-form>
    </fieldset>
    <fieldset class="fieldInfo">
      <legend>
        <span>复查情况</span>
      </legend>
      <el-form ref="postForm" :model="postForm" class="form-container">
        <div class="createPost-main-container">
          <el-row>
            <el-col :span="24">
              <div class="postInfo-container">
                <el-row>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="复查人" class="postInfo-container-item">
                      <el-input placeholder="请输入复查人" v-model="postForm.checkPersonName"></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item label-width="115px" label="复查日期" class="postInfo-container-item">
                      <el-input placeholder="请输入复查日期" v-model="postForm.checkDate"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label-width="115px" label="复查后照片" class="postInfo-container-item">
                      <ele-gallery :source="postForm.pics"></ele-gallery>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label-width="115px" label="复查内容" class="postInfo-container-item">
                      <el-input
                        placeholder="请输入复查内容"
                        v-model="postForm.checkContent"
                        type="textarea"
                        :rows="4"
                      ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
            </el-col>
          </el-row>
        </div>
      </el-form>
    </fieldset>
  </div>
</template>
<script>
import { validURL, validUsername } from '@/utils/validate'
import EleGallery from 'vue-ele-gallery'
export default {
  created() {
    if (this.isEdit) {
      //如果是编辑数据
      const id = this.$route.params && this.$route.params.id
      // this.fetchUserData(id)
    }
    this.tempRoute = Object.assign({}, this.$route)
  },
  props: {
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  components: {
    EleGallery
  },
  data() {
    return {
      loading: false,
      postForm: {
        companyName: '',
        grade: '',
        chargePerson: '',
        findDate: '',
        desc: '',
        pics: [
          'https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg',
          'https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg',
          'https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg'
        ],
        type: '',
        expirationDate: '',
        require: '',
        reformPersonName: '',
        reformDate: '',
        reformContent: '',
        checkPersonName: '',
        checkDate: '',
        checkContent: ''
      }
    }
  },
  methods: {}
}
</script>
<style lang="scss" scoped>
.fieldInfo {
  border-color: #eee;
  border-width: 1px;
  border-style: solid;
  margin-bottom: 20px;
  legend {
    color: #666;
  }
}
// .contentLength {
//   width: 600px;
//   word-break: break-all;
// }
</style>
